<template>
    <div>
        <van-row>
            <van-col span="12" v-for="(item, index) in list" :key="index">
                <div class="hd" @click="details(item.city_id)">
                    <image :src="item.img" mode="aspectFit" class="img">
                        <van-tag type="primary" mark size="medium" class="tag" v-if="item.state">{{ item.state }}</van-tag>
                        <text class="title">
                            {{ item.city }}
                        </text>
                    </image>
                </div>
            </van-col>
        </van-row>
    </div>
</template>

<script>

export default {
    data() {
        return {
            list: []
        };
    },
    onLoad() {
        this.getactivity();
    },
    onShow() {
        this.checkAuth()
    },
    methods: {
        getactivity() {
            this.request({
                url: "/activity_config",
                method: "get",
            }).then((res) => {
                this.list = res.data.data;
                console.log("huodong", this.list);
            });
        },
        details(city_id) {
            // console.log(city_id);
            uni.navigateTo({
                url: `/packone/activity_xq/index?city_id=${city_id}`
            })
        }
    }
};
</script>

<style>
.img {
    /* width: 330rpx; */
    width: 100%;
    height: 250rpx;
    /* filter: blur(1rpx); */
    filter: brightness(50%);
}

.hd {
    position: relative;
    height: 273rpx;
    /* width: 300rpx; */
    box-sizing: border-box;
}

.title {
    position: absolute;
    top: 33%;
    left: 37%;
    font-size: 20px;
    color: rgb(202, 170, 83);
}

.tag {
    position: relative;
    bottom: 258rpx;
    left: 13rpx;
}
</style>